// 导入vuex
import { useStore } from "vuex";
// 导入vue-router
import { useRouter } from "vue-router";
// 导入对话框
import { Modal } from "ant-design-vue";
// 导入创建虚拟DOM
import { createVNode } from "vue";
// 导入警告图标
import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
// 导入全局提示
import { message } from "ant-design-vue";

export const useLogout = () => {
  // 初始化vuex
  const store = useStore();
  // 初始化vue-router
  const router = useRouter();

  // 退出登录方法
  const logout = () => {
    // 确认退出弹窗
    Modal.confirm({
      title: "退出系统确认",
      icon: createVNode(ExclamationCircleOutlined),
      content: "确定要退出登录吗？",
      autoFocusButton: "cancel", //指定自动获得焦点的按钮
      okText: "确认",
      cancelText: "取消",
      onOk() {
        return new Promise((resolve) => {
          // 跳转登录页
          router.push("/login");
          // 将token设置为空
          store.commit("userStore/SET_TOKEN");
          // 将用户信息设置为空
          store.commit("userStore/SET_USERINFOS");
          // 将用token在本地删除
          window.localStorage.removeItem("token");
          // 将用户信息在本地删除
          window.localStorage.removeItem("userInfos");
          // 提示退出成功
          message.success("退出成功");
          // 结束加载
          resolve();
        }).catch(() => message.error("退出失败"));
      },
      onCancel() {
        return;
      },
    });
  };

  return {
    logout,
  };
};
